body {
  padding-top: 20px;
  padding-bottom: 20px;
  background:#0d306f url(../img/glass-blue.png) center top no-repeat;
}
h3 a{
	color:#0d306f;
}
h3 a:hover{
	color:#1b58c7;
}

.header,
.footer {
  padding-right: 15px;
  padding-left: 15px;
}


.header {
  /*border-bottom: 1px solid #e5e5e5;*/
}


#imgLogo{
	width:178px;
	height:85px;
	margin: 0 auto;
}
#imgLogo img{
	width:178px;
	height:85px;
}
#motoLogo{
	font-size:9px;
	height:15px;
	text-align:center;
	color:#fff;
	margin-top:2px;
	margin-bottom:20px;
	text-transform:uppercase;
}
.container{
	margin:0 auto;
}
.wrapper{
	background:#eeeeee;
	padding:5px;
	border: 1px solid #fff;
	box-shadow:0px 0px 30px #000;
	-moz-box-shadow:0px 0px 30px #000;
	-webkit-box-shadow:0px 0px 30px #000;
	text-align:center;
}
.lead{
	font-size:16px;
}
.lead b {
	font-size:18px;
}
#comentariu{
	display:none;
}
.textuser{
	width:262px;
	height:150px;
}
#msg{
	display:none;
}
.footer {
  padding-top: 19px;
  color: #777;
  border-top: 1px solid #e5e5e5;
}

.raspuns{
	width:98%;
	min-height:10px;
	margin:0 auto;
	margin-top:5px;
	margin-bottom:5px;
	cursor:pointer;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	vertical-align:middle;
	display: inline-block;
	font-size:15px;
	border:1px solid #ffffff;
	color:#000;
}

.color1{
	background:#2AE212;
}
.color2{
	background:#11E347;
}
.color3{
	background:#11E595;
}
.color4{
	background:#11E6E5;
}
.color5{
	background:#119AE8;
	color:#fff;
}
.color6{
	background:#114BEA;
	color:#fff;
}
.color7{
	background:#2610EB;
	color:#fff;
}
.color8{
	background:#7710ED;
	color:#fff;
}
.color9{
	background:#CA10EF;
	color:#fff;
}
.color10{
	background:#F010C2;
	color:#fff;
}
.color11{
	background:#F21070;
	color:#fff;
}
.color12{
	background:#F40F1C;
	color:#fff;
}
.btn input{
	width:100px;
}

@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {
table, thead, tbody, th, td, tr { 
	display: block; 
}

thead tr { 
	position: absolute;
	top: -9999px;
	left: -9999px;
	display:none;
}


tr:nth-child(even){
	background: #f2f2f2;
}
tr:nth-child(odd){
	background: #d3d3d3;
}

td { 
	
	border: none;
	border-bottom: 1px solid #666; 
	position: relative;
	padding-left: 50%; 
}

td:before { 
	position: absolute;
	top: 0;
	left: 0;
	width: 45%; 
	padding-right: 10px; 
	white-space: nowrap;
}

td:nth-of-type(1):before { content: "Data Ora"; background:#333;color:#fff;height:100%;}
td:nth-of-type(2):before { content: "Mag"; background:#333;color:#fff;height:100%;}
td:nth-of-type(3):before { content: "Adancime"; background:#333;color:#fff;height:100%;}
td:nth-of-type(4):before { content: "Lat"; background:#333;color:#fff;height:100%;}
td:nth-of-type(5):before { content: "Long"; background:#333;color:#fff;height:100%;}
td:nth-of-type(6):before { content: "Regiune"; background:#333;color:#fff;height:100%;}
td:nth-of-type(7):before { content: "Tip"; background:#333;color:#fff;height:100%;}
td:nth-of-type(8):before { content: ""; background:#333;color:#fff;height:100%;}
td:nth-of-type(7):before{border-bottom:10px solid #fff;}
td:nth-last-child(1){border-bottom:10px solid #fff;}
.btn input{
	width:120px;
}

}

@media (min-width: 768px) {
  .container {
    max-width: 730px;
  }
  .raspuns{
	min-height:20px;
	font-size:15px;
}
  table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
tr:nth-of-type(odd) { 
  background: #fff; 
}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}
th i{
	font-size:11px;
	font-weight:normal;
}
tr:hover{
	background:#ccc;
	cursor:pointer;
}


}

@media screen and (min-width: 768px) {
  .header,
  .marketing,
  .footer {
    padding-right: 0;
    padding-left: 0;
  }
  .header {
    margin-bottom: 30px;
  }



}


tr.red:first-child{
	background:#ff5656;
}
tr.orange:first-child{
	background:#fffccd;
}


#legenda{
	width:900px;
	height:55px;
}
.legendaCulori{
	width:73px;
	height:25px;
	float:left;
	text-align:center;
	padding-top:5px;
	margin-right:1px;
	margin-left:1px;
	cursor:pointer;
}
	